<template>
  <div>
    <van-swipe
      :autoplay="3000"
      lazy-render
      class="loop"
      :show-indicators="false"
    >
      <van-swipe-item v-for="image in images" :key="image">
        <img class="loopImg" :src="image" :style="{ height: HeiGht + 'vw' }" />
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script setup>

defineProps({
  images: {
    type: Array,
    default: [
      "https://t7.baidu.com/it/u=1819248061,230866778&fm=193&f=GIF",
      "https://t7.baidu.com/it/u=91673060,7145840&fm=193&f=GIF",
    ],
  },
  HeiGht: {
    type: Number,
    default: 40,
  },
});
</script>

<style scoped>
.loop {
  border-radius: 5px;
  width: 90vw;
  text-align: center;
  margin-top: 2.667vw;
}

.loopImg {
  width: 90vw;
}
</style>
